<template>
    <div class="template-index-Lu">
        <commpVxeTable
            :isCanWrap="true"
            :key="reCommpVxeTable"
            :config="dataTableConfig"
            :columns="columnsVxe"
            :formItem="formItem"
            @checkboxChange="checkboxChange"
            ref="administrativeOffice"
            @searchEvent="searchEvent"
            @resetEvent="resetEvent"
            >
            <template v-slot:operation_fjzblsj="{row}" data-desc="截止时间">
                <span :style="{color:isTimeout(row)}">{{ row.fjzblsj}}</span>
            </template>
            <template v-slot:operation_btn="{row}" data-desc="自定操作栏">
                <a-form layout="inline">
                    <a-form-item>
                        <a-button class="blue-btn" @click="reviseClick(row)">办理</a-button>
                    </a-form-item>
                    <!-- <a-form-item>
                        <a-popconfirm
                            title="您确定要撤回这条申请吗?"
                            ok-text="确定"
                            cancel-text="取消"
                            @confirm="revoke(row)"
                            @cancel="cancel"
                            >
                            <a-button
                                v-if="isTrun(row)"
                                class="red-btn">
                                撤回
                            </a-button>
                        </a-popconfirm>
                    </a-form-item> -->
                </a-form>
            </template>
        </commpVxeTable>
        <handleModal ref="handleModalRef" :passObj=passObj @success="success"></handleModal>
        <inHandleModal ref="inHandleModalRef" :passObj=passObj @success="success"></inHandleModal>
    </div>
</template>
<script>
import  commpVxeTable   from '@/components/commp-vxe-table/commp-vxe-table.vue'
import handleModal from './handleModal.vue'
import inHandleModal from '../applicationForPartyMembership/handleModal.vue'
import YchConstant from "@/api/YchConstant";
import store from '@/store'
export default {
    components: {
        commpVxeTable,handleModal,inHandleModal
    },
    data() {
        return {
            reCommpVxeTable: '',
            dataTableConfig: {
                api: YchConstant.SPZX_OA + '/mydbyb/DFDbList',
                rowId: 'id',
                urlType: true,
                paramet: {}
            },
            columnsVxe: [
                {
                    title: '标题',
                    field: 'fbt',
                },{
                    title: '摘要',
                    field: 'fzy',
                    align:'left',
                },{
                    title: '申请人',
                    field: 'fsqr',
                    width: 80
                },{
                    title: '申请时间',
                    field: 'fsqsj',
                    width: 150,
                },{
                    title: '环节名称',
                    field: 'fhjmc',
                },{
                    title: '截止时间',
                    field: 'fjzblsj',
                    slots: {
                        default: 'operation_fjzblsj',
                    },
                },{
                    title: '操作',
                    field: 'jobid',
                    width: 200,
                    slots: {
                    // 使用插槽模板渲染
                        default: 'operation_btn',
                    },
                }
            ],
            formItem: [
                {
                    label: '申请人',
                    model: 'fsqr',
                },
            ],
            idList: [],
            passObj: {},
        }
    },
    methods: {
        // 勾选
        checkboxChange(val){
            //console.log('已选择',val)
            this.idList = []
            if(val.length){
                val.forEach(item => {
                    this.idList.push(item.id)
                });
            }
        },
        // 搜索
        searchEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
        },
        // 重置
        resetEvent(){
            this.dataTableConfig.paramet = {
                ...this.dataTableConfig.paramet,
            }
        },
        // 点击办理
        reviseClick(row){
            //console.log(row)
            if(row.fhjmc == '递交入党申请书'){
                this.passObj = {
                    ...row,
                }
                this.$nextTick(_ => {
                    this.$refs.inHandleModalRef.handleModalVisible = true
                })
            } else {
                this.passObj = {
                    ...row,
                    title: row.fhjmc,
                }
                this.$nextTick(_ => {
                    this.$refs.handleModalRef.handleModalVisible = true
                })
            }
        },
        isTimeout(row){
            let timeOut = new Date(Date.parse(row.fjzblsj)).getTime()
            let date = new Date().getTime()
            if(date > timeOut){
                return 'red'
            }
            //console.log(timeOut,date)
        },
        // 撤回
        revoke(row){
            //console.log(row)
            //console.log(store.getters.userInfo.id)
            let data = {
                lcmbbm: row.flcmb,
                jobid: row.jobid
            }
            queryAllYbJob(data).then(res => {
                if(res.code == 200){
                    let rdata = {
                        lcmbbm: row.flcmb,
                        jobid: row.jobid,
                        opinion: '撤回申请',
                        shjid: res.result.result.result[0].id,
                        smgflag: "",
                        smsContent: ""
                    }
                    returnUpperzdyFlowJob(rdata).then(res => {
                        //console.log(res)
                        if(res.code == 200){
                            this.$message.success(res.message)
                            this.reCommpVxeTable = Date.now()
                        } else {
                            this.$message.warning(res.message)
                        }
                    })
                } else {
                    this.$message.warning(res.message)
                }
            })
        },
        cancel() {
            //console.log('Cancel');
        },
        success(){
            this.reCommpVxeTable = Date.now()
        }
    },
}
</script>
